<template>
  <div class="page">
   <div class="page1"> 欢迎你成为我们新的会员！</div>
    <div class="page2">{{count}}秒后跳转至网站首页</div>
  </div>
</template>

<script>
export default {
  name: 'ReleaseSucess',
  data () {
    return {
      count: ''
    }
  },
  created () {
    this.goGrdoupRecor()
  },
  methods: {
    goGrdoupRecor () {
      const TIME_COUNT = 3
      if (!this.timer) {
        this.count = TIME_COUNT
        this.show = false
        this.timer = setInterval(() => {
          if (this.count > 0 && this.count <= TIME_COUNT) {
            this.count--
          } else {
            this.show = true
            clearInterval(this.timer)
            this.timer = null
            this.$router.push({path: '/'})
          }
        }, 1000)
      }
    }
  }
}
</script>

<style scoped>
.page{
  background-image: url('/static/images/success.jpg');
  background-size: 100% 100%;
  background-attachment: fixed;
  background-repeat: no-repeat;
  height: 100vh;
}
.page1{
  text-align: center;
  padding-top: 200px;
  font-size: 60px;
  color: white;
}
.page2{
    text-align: center;
  padding-top: 20px;
  font-size: 20px;
  color: white;
}
</style>
